﻿<Page x:Class="TreeBuilder.Help.OptionsPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:m="clr-namespace:TreeBuilder.Help" xmlns:Controls="clr-namespace:Elderos.Controls;assembly=Elderos.Controls" mc:Ignorable="d" 
      d:DesignHeight="800" d:DesignWidth="600"
	Title="Options">
    <Page.Resources>
        <ResourceDictionary Source="pack://application:,,,/Help/HelpStyles.xaml"/>
    </Page.Resources>
    <Controls:HelpMasterPage>
        <Controls:HelpMasterPage.Title>Options</Controls:HelpMasterPage.Title>
        <Controls:HelpMasterPage.Content>
            <Grid>
                <RichTextBox BorderThickness="0">
                    <FlowDocument>
                        <Paragraph Style="{StaticResource HeaderStyle}" Margin="10,0,10,0">
                            General
                        </Paragraph>
                        <Paragraph Margin="0">
                            Options window contains many preferences, but they have identical behaviour.
                            When the text box gets red, it means thay you typed a wrong value. If you try
                            to save it, it will be reset to a default one. All other values are acceptable.
                        </Paragraph>
                        <Paragraph Style="{StaticResource HeaderStyle}" Margin="10,0,10,0">
                            Images options
                        </Paragraph>
                        <Paragraph Margin="0">
                            Image options tab contains preferences of creating and printing images. Currently, there are two options.
                        </Paragraph>
                        <List Margin="0">
                            <ListItem>
                                <Paragraph Margin="0">
                                    <Run FontWeight="Bold">Image frame</Run> -
                                    when you save (or print) a tree to an image file, the white frame is added around automatically.
                                    You can adjust the width of the left, top, right or bottom part.
                                </Paragraph>
                            </ListItem>
                            <ListItem>
                                <Paragraph Margin="0">
                                    <Run FontWeight="Bold">Resolution</Run> -
                                    also called DPI (dot-per-inch) - determines the count of pixels used for storing a square inch of
                                    the image. The bigger is the number, the clearer is the image and the larger is the file size.
                                    I recommend to use 220 dpi for general purposes.
                                </Paragraph>
                            </ListItem>
                        </List>
                        <Paragraph Style="{StaticResource HeaderStyle}" Margin="10,0,10,0">
                            Nodes options
                        </Paragraph>
                        <Paragraph Margin="0">
                            Here you can adjust default node style by pressing the font button. All new nodes you'll create will have the same appearance as show in the preview box.
                        </Paragraph>
                        <Paragraph Style="{StaticResource HeaderStyle}" Margin="10,0,10,0">
                            Indexes options
                        </Paragraph>
                        <Paragraph Margin="0">
                            Here you can adjust default style for both upper and lower indexes 
                            by pressing the corresponding font button. All new indexes 
                            you'll create will have the same appearance as shown in the preview box.
                        </Paragraph>
                        <Paragraph Style="{StaticResource HeaderStyle}" Margin="10,0,10,0">
                            Lines, arrows &amp; triangles options
                        </Paragraph>
                        <Paragraph Margin="0">
                            You can select default
                            <Run FontWeight="Bold">color</Run> ,
                            <Run FontWeight="Bold">thickness</Run> and
                            <Run FontWeight="Bold">dash style</Run> for both lines and arrows.
                            Arrows have also a preference called
                            <Run FontWeight="Bold">vertical offset</Run>. That's the minimal distance between 
                            the lowest node and the arc. A red line on the image below marks the line being drawn
                            there.
                        </Paragraph>
                        <BlockUIContainer>
                            <Canvas Height="150" Width="300" Background="White">
                                <TextBox 
                                    IsReadOnly="True" 
                                    Text="Node 1" 
                                    Canvas.Left="0" 
                                    Canvas.Top="0"/>
                                <Line Stroke="Black" X1="27" Y1="20" X2="27" Y2="80" />
                                <Line Stroke="Red" X1="27" Y1="80" X2="27" Y2="100" />
                                <Path Stroke="Black">
                                    <Path.Data>
                                        <PathGeometry>
                                            <PathFigure StartPoint="27,100">
                                                <ArcSegment Point="100,100" Size="1,1"/>
                                            </PathFigure>
                                        </PathGeometry>
                                    </Path.Data>
                                </Path>
                                <Line Stroke="Red" X1="100" Y1="80" X2="100" Y2="100" />
                                <Polygon Fill="Black" Points="100,70 105,80 95,80"/>
                                <TextBox  
                                    IsReadOnly="True" 
                                    Text="Node 2" 
                                    Canvas.Left="74" 
                                    Canvas.Top="50"/>
                                <TextBox 
                                    IsReadOnly="True" 
                                    Text="Node 1" 
                                    Canvas.Left="150" 
                                    Canvas.Top="60"/>
                                <Line Stroke="Red" X1="177" Y1="80" X2="177" Y2="100" />
                                <Path Stroke="Black">
                                    <Path.Data>
                                        <PathGeometry>
                                            <PathFigure StartPoint="177,100">
                                                <ArcSegment Point="250,100" Size="1,1"/>
                                            </PathFigure>
                                        </PathGeometry>
                                    </Path.Data>
                                </Path>
                                <Line Stroke="Red" X1="250" Y1="80" X2="250" Y2="100" />
                                <Line Stroke="Black" X1="250" Y1="80" X2="250" Y2="30" />
                                <Polygon Fill="Black" Points="250,20 255,30 245,30"/>
                                <TextBox  
                                    IsReadOnly="True" 
                                    Text="Node 2" 
                                    Canvas.Left="224" 
                                    Canvas.Top="0"/>
                            </Canvas>
                        </BlockUIContainer>
                    </FlowDocument>
                </RichTextBox>
            </Grid>
        </Controls:HelpMasterPage.Content>
    </Controls:HelpMasterPage>
</Page>
